<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<link rel="stylesheet" href="../../PC/css/reset.css">
	<script src="../js/rem.js"></script>
	
	<style>
		.box{
			width: 100vw;
			min-height: 100vh;
			background-image: url('https://img2.baidu.com/it/u=1500144023,2626386074&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=888');
			background-repeat: no-repeat;
			overflow: hidden;
		}
		.wrap{
			height: 3rem;
			display: flex;
			/* 外边距塌陷 */
			margin-top: 3rem; 
			flex-direction: column;
			justify-content: center;
			align-items: center;
			line-height: .8rem;
		}
		.user,.pwd {
			font-size: 16px;
			color: #000;
		}
		.wrap span{
			margin-right: 10px;
		}
		.wrap input{
			height: .6rem;
			border-radius: 0.06rem;
			padding-left: 0.08rem;
		}
		.zhuce{
			text-align: right;
			padding-right: 1.3rem;
		}
		.btn{
			text-align: center;
			font-size: 0.4rem;
			border: 1px solid #999;
			width: 90vw;
			margin: 0 auto;
			border-radius: 8px;
			margin-top: 8px;
		}
	</style>
</head>
<body>
	<div class="box">
		<div class="wrap">
			<div class="user"><span>用户</span><input type="text" class="userInput"></div>
			<div class="pwd"><span>密码</span><input type="password" class="pwdInput"></div>
		</div>
		<div class="zhuce" onclick="goToZhuCe()">没有账号</div>
		<div class="btn" onclick="goToPageList()">
			登录
		</div>
	</div>
	<script src="../../public1/js/pubilc.js"></script>
	<script src="../../public1/js/md5.js"></script>
	<script>
		var user = document.querySelector('.userInput')
		var pwd = document.querySelector('.pwdInput')
		function goToZhuCe(){
			location.replace('./zhuce.html')
		}
		function goToPageList(){
			xhr({
				methods:'post',
				url:'/user/getLogin',
				data:JSON.stringify({
					userPhone:user.value,
					password:md5(pwd.value),
					rolu:1
				}),
				success:function(res){
					location.replace('./goodsList.html?token='+res.data.token)
				}
			})
	
		}

	</script>
	
</body>
</html>